<template>
	<div class="subpage">
		<div class="wrap">
			<resale-head :itemData="item"></resale-head>
			<div class="bg"></div>
			<van-list
				v-model="loading"
				:immediate-check="false" 
				:finished="finished" 
				finished-text="已加载全部了哦～"
				@load="onLoadMore"
				v-if="recordList.length > 0">
				<resale-record :recordData="recordList" :reordObj="reordObj"></resale-record>
			</van-list>
		</div>
		
		<div class="footer">
			<div class="btnbox">当前无可转售牛只</div>
		</div>
	</div>
</template>

<script>
	import { PullRefresh, List } from 'vant';
	
	import ResaleHead from '../resalecomponent/ResaleHead.vue'   //  头部
	import ResaleRecord from'../resalecomponent/ResaleRecord.vue'
	 export default {
		 components: {
			ResaleHead,
			ResaleRecord,
			[PullRefresh.name]: PullRefresh,
			[List.name]: List
		 },
		 data(){
			 return {
				item: {
					 
				},
				saleRecord: {
					resale_id: '',
					pgCt: 1,
					pgSz: 10
				},
				recordList: [],
				reordObj: {},
				loading: false,
				isLoading: false,
				finished: false,
				pageIndex: 1,
				pageSize: 10,
			 }
		 },
		 created(){
			 this.getResaleDetail()   // 转售详情
			 this.getResaleRecord()  // 转售记录
		 },
		 methods: {
			 // 转售详情
			 getResaleDetail(){
			 	this.$api.get('/api/resale/detail/' + this.$route.params.orderId) // 转售id
			 	.then(({data})=>{
			 		this.item = data;
			 	})
			 },
			 // 转售记录
			 getResaleRecord(){
				let getData = {
				 	pgCt: this.pageIndex,
				 	pgSz: this.pageSize
				}
				let apiUrl = this.pageIndex > 1 ? '/api/resale/record/' +this.$route.params.orderId+ '?noLoading' : '/api/resale/record/' + this.$route.params.orderId;
			 	this.$api.get(apiUrl, getData)  // 转售id
			 	.then(({data})=>{
					this.recordList = this.recordList.concat(data.userResaleDetailSellRecordVoIPage.records);
					this.reordObj.savesNum = data.savesNum;
					this.reordObj.sellOutNum = data.sellOutNum;
					this.reordObj.sellingNum = data.sellingNum;
					// 数据全部加载完成
					if(this.pageIndex > 1 && data.userResaleDetailSellRecordVoIPage.records.length < 10){
						this.finished = true;
					}
					
			 	})
			 },
			onLoadMore() {
				// 异步更新数据
				setTimeout(() => {
				    this.pageIndex++;
				    this.getResaleRecord()
				    // 加载状态结束
				    this.loading = false;
				}, 500);
			}
		 }
	 }
	 
	 
	 
</script>

<style class="scss" scoped>
	.wrap{
		width: 100%;
		height: calc(100% - 62px);
		overflow-y: scroll;
		-webkit-overflow-scrolling: touch;
	}
	    
	.bg{
		width: 100%;
		height: 10px;
		background-color: #f8f8f8;
	}
	.footer{
		width: 100%;
		height: 62px;
		display: flex;
		justify-content: space-around;
		align-items: center;
		background-color: #fff;
		box-shadow: 0.05333rem 0.05333rem 0.13333rem #c2c2c2;
		-webkit-box-shadow: 0.05333rem 0.05333rem 0.13333rem #c2c2c2;
		position: fixed;
		left: 0;
		bottom: 0;
	}
	.btnbox{
		width: 343px;
		height: 51px;
		background: #D0CFCF;
		border-radius: 26px;
		line-height: 51px;
		text-align: center;
		color: #fff;
		font-size: 16px;
	}
</style>
